<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" th:href="@{/css/swiper-bundle.css}">
    <link rel="stylesheet" th:href="@{/css/index.css}">
    <script th:src="@{/js/swiper-bundle.js}"></script>
    <style>
        * {
            padding: 0;
            margin: 0;
        }

        body {
            background: rgb(235, 235, 235);
        }

        a {
            text-decoration: none;
            color: white;
        }

        li {
            list-style: none;
            font-size: 20px;
        }
    </style>
</head>
<body>
<div id="header">
    <a th:href="@{/index}" id="logo">领贤兼职</a>
    <div id="nav">
        <ul>
            <li><a th:href="@{/index}">首页</a></li>
            <li><a th:href="@{/range}">领贤兼职</a></li>
            <li><a th:href="@{/company_login}">企业服务</a></li>
            <li><a th:href="@{/student_login}">学生登陆</a></li>
            <li><a th:href="@{/university_login}">学校服务</a></li>
        </ul>
    </div>
</div>
<div id="container" th:style="'background: url('+'ptplatform/images/page2.jpg'+') no-repeat center;background-size: 100% 100%;'">
    <a class="main_a main_b" th:href="@{/range}">找兼职</a>
    <a class="main_a" th:href="@{/company_login}">发布兼职</a>
</div>
<div class="swiper-container" id="sec">
    <div class="swiper-wrapper">
        <div class="swiper-slide"><img src="" th:src="@{/ptplatform/images/slide/slide001.jpg}" style="width: 100%;height: 100%"/></div>
        <div class="swiper-slide"><img src="" th:src="@{/ptplatform/images/slide/slide002.jpg}" style="width: 100%;height: 100%"/></div>
        <div class="swiper-slide"><img src="" th:src="@{/ptplatform/images/slide/slide003.jpg}" style="width: 100%;height: 100%"/></div>
        <div class="swiper-slide"><img src="" th:src="@{/ptplatform/images/slide/slide004.jpg}" style="width: 100%;height: 100%"/></div>
        <div class="swiper-slide"><img src="" th:src="@{/ptplatform/images/slide/slide005.jpg}" style="width: 100%;height: 100%"/></div>
        <div class="swiper-slide"><img src="" th:src="@{/ptplatform/images/slide/slide006.jpg}" style="width: 100%;height: 100%"/></div>
        <div class="swiper-slide"><img src="" th:src="@{/ptplatform/images/slide/slide007.jpg}" style="width: 100%;height: 100%"/></div>
        <div class="swiper-slide"><img src="" th:src="@{/ptplatform/images/slide/slide008.jpg}" style="width: 100%;height: 100%"/></div>
        <div class="swiper-slide"><img src="" th:src="@{/ptplatform/images/slide/slide009.jpg}" style="width: 100%;height: 100%"/></div>
        <div class="swiper-slide"><img src="" th:src="@{/ptplatform/images/slide/slide010.jpg}" style="width: 100%;height: 100%"/></div>
        <div class="swiper-slide"><img src="" th:src="@{/ptplatform/images/slide/slide011.jpg}" style="width: 100%;height: 100%"/></div>
        <div class="swiper-slide"><img src="" th:src="@{/ptplatform/images/slide/slide012.jpg}" style="width: 100%;height: 100%"/></div>
        <div class="swiper-slide"><img src="" th:src="@{/ptplatform/images/slide/slide013.jpg}" style="width: 100%;height: 100%"/></div>
        <div class="swiper-slide"><img src="" th:src="@{/ptplatform/images/slide/slide014.jpg}" style="width: 100%;height: 100%"/></div>
    </div>
    <div class="swiper-pagination"></div>
    <div style="position: absolute;right: 0;height: 100%;width: 60px;top: 0;background: rgba(0,0,0,0.1);z-index: 10">
        <div class="swiper-button-next"></div>
    </div>
    <div style="position: absolute;left: 0;height: 100%;width: 60px;top: 0;background: rgba(0,0,0,0.1);z-index: 10">
        <div class="swiper-button-prev"></div>
    </div>
</div>
<br>
<br>
<div id="footer">
    <br>
    <h1 style="text-align: center;color: white">Designed by wu zi xuan   !!!!</h1>
</div>


<script>
    let swiper = new Swiper('.swiper-container', {
        slidesPerView: 1,
        spaceBetween: 30,
        loop: true,
        autoplay: true,
        pagination: {
            el: '.swiper-pagination',
            clickable: true,
        },
        navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
        },
    });
</script>
</body>
</html>